<template>
  <div>
    <div class="box">
      <div class="icon"></div>
      <div class="text">
        向导配置完成，{{num}}秒后跳转到首页，您也可以点击此处
        <router-link to="/welcome">
        <a href="#">直接跳转</a>
      </router-link>
      </div>
    </div>
  </div>
</template>

<script>
  export default {
    data(){
      return{
        num:5,
        timer: null
      }
    },
    mounted(){
      this.time()
    },
    destroyed() {
      clearInterval(this.timer)
    },
    methods:{
      bb(){
        this.$router.push('/welcome')
      },
      time(){
        this.timer = setInterval(() => {
           //需要定时执行的代码
          this.num=this.num-1
          if(this.num==0){
            this.$router.push('/welcome')
            clearInterval(this.timer)
          }
        },1000)
      }
    }
  }
</script>

<style lang="less" scoped>
@qq:19.2vw;
.box{
  padding-top: (200/@qq);
  width: 100%;
  color: #15A3AF ;
  height: (600/@qq);
  .icon{
    margin: auto;

    width: (70/@qq);
    height: (70/@qq);
    background: url('./img/icoon.png') no-repeat center;
    background-size: 100%;
    margin-bottom: (70/@qq);

  }
  .text{
    width: (600/@qq);
    height: (50/@qq);
    text-align: center;
    margin: auto;
    font-size: (18/@qq);
    a{
      color: #15A3AF ;
      border-bottom: 1px solid #15A3AF;
    }
  }
}
</style>